<template>
  <smart-table
    :title="courseTitle"
    :formList="courseFormList"
    :selectUrl="courseSelectUrl"
    :insertUrl="courseInsertUrl"
    :updateUrl="courseUpdateUrl"
    :deleteUrl="courseDeleteUrl"
    :exportExcelUrl="courseExportUrl"
    :importExcelUrl="courseImportUrl"
    :tableColumns="courseTableColumns"
    :formButtonCtl="courseFormButtonCtl"
    :formRules="courseFormRules"
    :maxOptionButtonCount="5"
    :dialogWidth="50"
    :dialogLabelWidth="10"
    fileIndex="posters">
    <template slot="table-button" slot-scope="row">
      <el-button type="warning" icon="el-icon-s-order" @click="toNode(row.row)">排课</el-button>
    </template>
  </smart-table>
</template>

<script>
export default {
  data() {
    return {
      //主题
      courseTitle: '课程',
      //表单列表
      courseFormList: [
        {
          title: '课程名',
          name: 'name',
          type: 'input',
          width: 80,
        },
        {
          title: '科目',
          name: 'subjectId',
          type: 'select',
          width: 80,
          key: 'id',
          label: 'name',
          optionList: [],
          showValue: false,
        },
        {
          title: '描述',
          name: 'description',
          type: 'markdown',
          hidden: {
            header: true,
          },
        },
        {
          title: '海报',
          name: 'posters',
          type: 'image',
          width: 80,
          hidden: {
            header: true,
          },
        },
      ],
      //课程查询路径
      courseSelectUrl: 'course/lookCourse',
      //课程新增路径
      courseInsertUrl: 'course/insertOneCourse',
      //课程更新路径
      courseUpdateUrl: 'course/updateOneCourse',
      //课程删除路径
      courseDeleteUrl: 'course/deleteCourses',
      //课程导出路径
      courseExportUrl: '/courseService/course/export',
      //课程导入名称
      courseImportUrl: '/courseService/course/import',
      //表格列
      courseTableColumns: [
        {
          title: '课程名',
          name: 'name',
        },
        {
          title: '科目名',
          name: 'subjectName',
          filters: [],
          filterName: 'name',
        },
        {
          title: '课程描述',
          name: 'description',
        },
        {
          title: '海报',
          name: 'posters',
          type: 'image',
        },
        {
          title: '课次',
          name: 'number',
        },
        {
          title: '创建时间',
          name: 'createTime',
          width: 180,
        },
        {
          title: '修改时间',
          name: 'updateTime',
          width: 180,
        },
      ],
      //表单按钮控制
      courseFormButtonCtl: {
        detailButton: false,
      },
      //表单校验
      courseFormRules: {
        name: [
          {
            required: true,
            message: '课程名不得为空!',
            trigger: 'blur',
          },
        ],
        subjectId: [
          {
            required: true,
            message: '科目不得为空!',
            trigger: 'change',
          },
        ],
      },
    }
  },
  created() {
    this.initSubjectData()
  },
  methods: {
    initSubjectData() {
      this.$store.dispatch('subject/lookSubjectAll').then((response) => {
        this.courseFormList[1].optionList = response.data
        this.courseTableColumns[1].filters = response.data
      })
    },
    //排课
    toNode(node) {
      this.$router.push({
        name: 'CourseNode',
        query: { courseId: node.id },
      })
    },
  },
}
</script>

<style lang="scss" scoped></style>
